import React,{Component} from 'react'
import { Button, ScrollView,StyleSheet,Image,View,Text,ListView,Dimensions,TouchableOpacity} from 'react-native'
import { SafeAreaView, StackNavigator, TabNavigator } from 'react-navigation'
import Citylist from './citylist'
import Townlist from './town'
import Threeslist from './threecitys'
let {height, width} = Dimensions.get('window');
//消息页面接口
/**
 * 初始化参数
 * @type {Object}
 */
const initParams = {
  sorceColor:'#00ff00',//默认字体颜色
  onPressColor:'#ff00ff',//点击后字体颜色
  person:false,//是否开启赚客模式
  underlayColor:"rgb(210, 230,255)",//点击背景颜色
}
const ProviceScreen = ({navigation})=>(
  <Citylist navigation={navigation} {...initParams} />
)
ProviceScreen.navigationOptions=({navigation})=>{
  return({
    title:'请选择省',
    headerTitleStyle:{alignSelf:'center',fontSize:16,},
    headerRight:(
      <View style={{marginRight:16}}>
        <TouchableOpacity
          
          onPress = {()=>{
            //回调函数
            let citys = []
            citys.push(`${navigation.state.params.getCity}`)
            citys.push(`${navigation.state.params.ProviceCity}`)

            console.log(citys)
          }}
        >
        <Text >
          {initParams.person==true?'':'确定'}
        </Text>
        </TouchableOpacity>
      </View>
    ),
    headerLeft:(
      <View>
        <TouchableOpacity
          style = {{width:44,height:44,justifyContent:'center',alignItems:'center'}}
          onPress = {()=>{
            //回调函数
            navigation.goBack()
          }}
        >
          <Image style={{width:26,height:26}} source={require('../../static/Image/back.png')} />
        </TouchableOpacity>
      </View>
    )
  })
}
const CityScreen = ({navigation,desc})=>(
 <Citylist navigation={navigation} {...initParams} />
)
CityScreen.navigationOptions=({navigation})=>{
  //let {tittle,isBack} = navigation.state.params
  return({
   title:`${navigation.state.params.choseName}`,
    headerTitleStyle:{alignSelf:'center',fontSize:16,},
    tintColor:'white',
    headerRight:(
      <View style={{marginRight:16}}>
        <TouchableOpacity
          
          onPress = {()=>{
            //回调函数
            let citys = []
            citys.push(`${navigation.state.params.getCity}`)
            citys.push(`${navigation.state.params.ProviceCity}`)

            console.log(citys)
          }}
        >
        <Text>{`${navigation.state.params.choseTittle?navigation.state.params.choseTittle:' '}`}</Text>
        </TouchableOpacity>
      </View>
    ),
    headerLeft:(
      <View>
        <TouchableOpacity
          style = {{width:44,height:44,justifyContent:'center',alignItems:'center'}}
          onPress = {()=>{
            //回调函数
            navigation.state.params.callBackFun(navigation.state.params.choseId)
            navigation.goBack()
          }}
        >
          <Image style={{width:26,height:26}} source={require('../../static/Image/back.png')} />
        </TouchableOpacity>
      </View>
      )
  })
}
const MessageTabs = StackNavigator({
  Provice: {
    screen: ProviceScreen,
  },
  City:{
    screen: CityScreen,
  },

},{
  initialRouteName: 'Provice', // 默认显示界面
});
class CityChoose extends Component{
  constructor(props){
    super(props)
  }
	render(){
		return (
			<MessageTabs  />
		)
	}
}

module.exports = CityChoose
